<template>
    <div>
        <div class="enterprise" v-if="userType == '2'">
            <el-card class="index">
              <div slot="header" class="clearfix">
                <span>营业执照</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pLicense"></el-image>
               </el-col>
               <el-col :span="6"><span> 商户注册名称：{{ merchantInfo.merchantName }} </span> </el-col>
               <el-col :span="6"><span>营业执照编号：{{ merchantInfo.businessLicence }}</span> </el-col>
               <el-col :span="6"><span> 商户注册地址：{{ merchantInfo.merchantAddress }}</span></el-col>
               <el-col :span="6"><span> 证件有效期：{{ merchantInfo.businessLicenceStt + ' - ' +  merchantInfo.businessLicenceExpire}}</span></el-col>
            </el-row>
          </div>
         </el-card>
         <el-card class="index">
              <div slot="header" class="clearfix">
                <span>法人信息</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pIdcardA"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pIdcardB"></el-image>
               </el-col>
               <el-col :span="6"><span> 法人姓名：{{ merchantInfo.legalName }} </span> </el-col>
               <el-col :span="6"><span> 证件号码：{{ merchantInfo.legalCertNo }}</span> </el-col>
               <el-col :span="6"><span> 法人证件地址：{{ merchantInfo.legalAddr }}</span></el-col>
               <el-col :span="6"><span> 证件有效期：{{ merchantInfo.legalCertStt + ' - ' +  merchantInfo.legaCertExpire}}</span></el-col>
               <!-- <el-col :span="6"><span style="display:flex;align-items: center;flex-shrink: 0;"> 商户注册地址：
               <el-cascader
                    style="width: 60%;"
                    v-model="merchantInfo.areaArr"
                    :options="regionList"
                    :placeholder="`${merchantInfo.provName +'/'+ merchantInfo.cityName + '/'+ merchantInfo.areaName}`"
                    :props="detailRegion"
                    @change="detailRegionChange">
                </el-cascader>
               </span>
              </el-col> -->
            </el-row>
          </div>
         </el-card>
         <el-card class="index">
              <div slot="header" class="clearfix">
                <span>经营信息</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pOutside"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pInside"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pCashier"></el-image>
                </el-col>
               <el-col :span="6"><span> 公司类型：{{ merchantInfo.merchantType == '1' ? '私营企业' : '个体工商户' }} </span> </el-col>
               <el-col :span="6"><span> 商户名称：{{ merchantInfo.merchantBusinessName }}</span> </el-col>
               <el-col :span="6"><span> 商户简称：{{ merchantInfo.merchantShortName }}</span></el-col>
               <el-col :span="6"><span> 商户负责人：{{ merchantInfo.contactName }}</span></el-col>
               <el-col :span="6"><span> 手机号：{{ merchantInfo.contactPhone }}</span></el-col>
               <el-col :span="6"><span> 客服电话：{{ merchantInfo.servicePhone }}</span></el-col>
               <el-col :span="6"><span> 邮箱：{{ merchantInfo.contactEmail }}</span></el-col>
               <el-col :span="6"><span> 所属行业：{{ merchantInfo.mccName }}</span></el-col>
            </el-row>
          </div>
         </el-card>
         <el-card class="index">
              <div slot="header" class="clearfix">
                <span>银行卡绑定</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;flex-wrap: wrap;">
                 <el-image v-if="merchantInfo.accountType == '2'" style="width: 90px; height: 90px" :src="merchantInfo.pBankcardA"></el-image>
                 <el-image v-if="merchantInfo.accountType == '1'" style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pOpenAccount"></el-image>
                 <el-image v-if="merchantInfo.accountType == '3'"  style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pBankIdcardA"></el-image>
                 <el-image v-if="merchantInfo.accountType == '3'" style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pBankIdcardB"></el-image>
                 <el-image v-if="merchantInfo.accountType == '3'" style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pUnincorporated"></el-image>
               </el-col>
               <el-col :span="6"><span> 银行账户类型：{{ merchantInfo.accountType == '1' ? '对公' : merchantInfo.accountType == '2' ? '法人对私' : '非法人对私'}} </span> </el-col>
               <el-col :span="6"><span>银行账户号：{{ merchantInfo.accountCardNum }}</span> </el-col>
               <el-col :span="6"><span> 银行名称：{{ merchantInfo.bankName }}</span></el-col>
               <el-col :span="6"><span> 银行预留手机号：{{ merchantInfo.accountPhone }}</span></el-col>
               <el-col :span="6"><span> 开户许可证核准号：{{ merchantInfo.openLicenceNo }}</span></el-col>
               <el-col :span="6" v-if="merchantInfo.accountType == '3'"><span> 持卡人证件号码：{{ merchantInfo.principalCertNo }}</span></el-col>
               <el-col :span="6"><span> 结算费率：{{ merchantInfo.rate }}</span></el-col>
               <el-col :span="6" v-if="merchantInfo.accountType == '3'"><span> 持卡人证件有效期：{{ merchantInfo.principalCertStt + ' - ' + merchantInfo.principalCertExpire  }}</span></el-col>
            </el-row>
          </div>
         </el-card>
        </div>
        <div v-else> 
            <el-card class="index">
              <div slot="header" class="clearfix">
                <span>个人信息</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pIdcardA"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pIdcardB"></el-image>
                </el-col>
               <el-col :span="6"><span> 姓名：{{ merchantInfo.merchantName }} </span> </el-col>
               <el-col :span="6"><span>手机号：{{ merchantInfo.contactPhone }}</span> </el-col>
               <el-col :span="6"><span> 证件号码：{{ merchantInfo.principalCertNo }}</span></el-col>
               <el-col :span="6"><span> 证件有效期：{{ merchantInfo.principalCertStt + ' - ' +  merchantInfo.principalCertExpire}}</span></el-col>
               <el-col :span="6"><span> 电子邮箱：{{ merchantInfo.contactEmail }}</span></el-col>
               <el-col :span="6"><span> 地址：{{ merchantInfo.legalAddr }}</span></el-col>
            </el-row>
          </div>
         </el-card>
         <el-card class="index">
              <div slot="header" class="clearfix">
                <span>经营信息</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pOutside"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pInside"></el-image>
                 <el-image style="width: 90px; height: 90px;margin-left:20px;" :src="merchantInfo.pCashier"></el-image>
                </el-col>
               <el-col :span="6"><span> 商户负责人：{{ merchantInfo.contactName }} </span> </el-col>
               <el-col :span="6"><span>商户简称：{{ merchantInfo.contactPhone }}</span> </el-col>
               <el-col :span="6"><span> 商户经营地址：{{ merchantInfo.merchantAddress }}</span></el-col>
                   <el-col :span="6"><span> 所属行业：{{ merchantInfo.mccName }}</span></el-col>
            </el-row>
          </div>
         </el-card>
         <el-card class="index">
              <div slot="header" class="clearfix">
                <span>银行卡绑定</span>
              </div>
              <div v-if="merchantInfo">
             <el-row >
               <el-col :span="6" style="display:flex;justify-content:center;">
                 <el-image style="width: 90px; height: 90px" :src="merchantInfo.pBankcardA"></el-image>
                </el-col>
               <el-col :span="6"><span> 银行账户名称：{{ merchantInfo.accountCardName }} </span> </el-col>
               <el-col :span="6"><span>银行账户号：{{ merchantInfo.accountCardNum }}</span> </el-col>
               <el-col :span="6"><span> 银行名称：{{ merchantInfo.bankName }}</span></el-col>
                   <el-col :span="6"><span> 银行预留手机号：{{ merchantInfo.mccName }}</span></el-col>
                   <el-col :span="6"><span> 结算费率：{{ merchantInfo.rate }}</span></el-col>

            </el-row>
          </div>
         </el-card>
        </div>
        <!-- <el-card style="margin-top:20px" v-if="qry_cash_config_list.length > 0">
      <div slot="header" class="clearfix">
        <span>取现配置</span>
      </div>
      <div v-for="item in merchantInfo.qrySettleConfigList" v-if="item.switch_state == 1" :key="item.cash_type">
        <el-divider content-position="left">{{ item.cash_type }}取现配置</el-divider>
      <el-row>
         <el-col :span="8">
           <span> 是否开通：{{ item.switch_state == '0' ? '未开通' : '已开通' }}</span>
         </el-col>
         <el-col :span="8">
           <span> 提现手续费(固定/元)：{{ item.fix_amt }}元</span>
         </el-col>
         <el-col :span="8">
           <span> 费率(百分比/%)：{{ item.fee_rate}}%</span>
         </el-col>
      </el-row>
      <el-row>
         <el-col :span="8">
           <span> 手续费内外扣标记：{{ item.out_cash_flag == '1' ? '外扣' : '内扣'}}</span>
         </el-col>
      </el-row>
      </div>
</el-card> -->
    </div>
</template>
<!--  -->
<script>
export default{
    props:{
        merchantInfo:[Object],
        userType:[String],
        regionList:[Array]
    },
    methods:{
      // detailRegionChange(v){
      //   this.$emit()
      // }
    }
}
</script>
<style scoped>
 .index{
   margin-bottom:20px;
 }
 .index span{
    color: #4e5969;
    font-size:14px;
   }
   .index .el-col{
      margin-bottom:15px;
   }
   .el-button span{
    color: #fff;
    font-size: 14px;
   }
   ::v-deep .el-radio--medium.is-bordered{
      display: flex;
      align-items: center;
      height: 140px;
      width: 100%;
   }
   ::v-deep .el-radio__label{
      margin-left:20px;
   }
   ::v-deep .protocol > .el-checkbox__input.is-checked+.el-checkbox__label{
      color:#4e5969 !important;
   }
   /* ::v-deep .el-input__inner > ::placeholder{
      color:red;
      font-size: 16px;
  } */
</style>